<template>
    <div>
        <el-dialog :visible.sync="value" :show-close="false" center>
            <el-checkbox-group v-model="selected">
                <el-checkbox :label="role.id" :key="role.id" v-for="role in roleList">{{role.name}}</el-checkbox>
            </el-checkbox-group>
            <template slot="footer">
                <Button type="primary" icon="md-add" v-loading.fullscreen.lock="fullscreenLoading" @click="handleSubmit">提交</Button>
            </template>
        </el-dialog>
    </div>
</template>

<script>

    import { saveOrUpdateUserRole,findAll } from '@/api/system/access/role'

    export default {
        name: "school-teacher-role",
        data(){
            return {
                fullscreenLoading:false,
                value : false,
                parent:{},
                roleList:[],
                selected:[]
            }
        },
        watch:{
            value(data){
                if(data){
                    findAll().then(res=>{
                        this.roleList = res.data.data;
                    });

                    setTimeout(()=>{
                        if(this.parent.roleIds){
                            this.selected = this.parent.roleIds.split(',');
                        }
                    },500);
                }
            }
        },
        methods:{
            handleSubmit(){
                if(this.selected.length == 0){
                    this.$message.warning({message:"请选择角色",center:true});
                    return false;
                }
                let roleIds = this.selected.join(",");
                let userId = this.parent.id;

                saveOrUpdateUserRole({userId:userId,roleIds:roleIds}).then(res=>{
                    this.value = false;
                    this.fullscreenLoading = false;
                    this.$parent.getTeacherList(this.$parent.params);
                })
            }
        }
    }
</script>

<style scoped>

</style>